<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Convas</title>
<style>
	*{outline:none;margin:0px;padding:0px;}
	body{width:100%;height:100%;margin:0px;padding:0px; overflow-y:hidden;}
	canvas{background:#cfcfcf;width:100%;height:100%;}
</style>
</head>

<body>
<canvas id="canvas">
	你的浏览器不支持canvas标签。
</canvas>
<script>
var canvas = document.getElementById('canvas');
var cxt = canvas.getContext('2d');
//设置线宽
cxt.lineWidth=20;
//开始点
cxt.moveTo(20,20);
//移动的方向
cxt.lineTo(100,20);
//添充颜色
cxt.stroke();
</script>
</body>
</html>